import React from 'react'
import { connect } from 'react-redux'
import {Navigate, HashRouter ,BrowserRouter, Route, Routes, Link } from 'react-router-dom';
import About from './components/About'
import ChooseStageScene from './components/ChooseStageScene'
import Inspector from './components/dev-only/Inspector'
import Editor from './components/Editor'
import Gallery from './components/Gallery'
import GameoverScene from './components/GameoverScene'
import GameScene from './components/GameScene'
import GameTitleScene from './components/GameTitleScene'
import { MyStagePage ,MyStagePage2 } from './components/StageList'
import { GameRecord } from './reducers/game'
import { firstStageName as fsn } from './stages'
import { State } from './types'
class App extends React.PureComponent<{ game: GameRecord }> {
  render() {
    return (
      <HashRouter>
        <div style={{ display: 'flex' }}>
          <Routes>
            <Route path="/list" element={<Navigate to="/list/default" replace />} />
            <Route path="/list/default" element={<Navigate to="/list/default/1" replace />} />
            <Route path="/list/custom" element={<Navigate to="/list/custom/1" replace />} />
            <Route path="default/:page" element={<MyStagePage />} />
            <Route path="custom/:page" element={<MyStagePage2 />} />
            <Route path="/editor" element={<Editor />} />
            <Route path="/gallery" element={<Gallery />} />
            <Route path="/gameover" element={<GameoverScene />} />
            <Route path="/choose" element={<Navigate to={`/choose/${fsn}${location.search}`} replace />} />
            <Route path="/choose/:stageName" element={<ChooseStageScene />} />
            <Route path="/stage" element={<Navigate to={`/stage/${fsn}${location.search}`} replace />} />
            <Route path="/stage/:stageName" element={<GameScene />} />
            <Route path="*" element={<GameTitleScene />} />
          </Routes>
          {
          //DEV.HIDE_ABOUT ? null : <About />
          //DEV.INSPECTOR && <Inspector />
          }
        </div>
      </HashRouter>
    )
  }
}

export default App

